<template>
  <el-checkbox-group v-model="curValue" class="checkbox-group" v-bind="$attrs" v-on="$listeners">
    <el-checkbox v-for="(item,i) in comOptList" :key="i" :label="item.dictCode">{{ item.dictName }}</el-checkbox>
  </el-checkbox-group>
</template>
<script>
import { SLMDict } from '@/api/dataDict'
export default {
  name: 'CDictCheckboxSelect',
  inheritAttrs: false,
  props: {
    dictTypeCode: {
      type: String,
      default: ''
    },
    value: {
      type: [Array],
      default: () => []
    },
    includes: {
      type: Array,
      default: undefined
    },
    excludes: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      optList: [],
      curValue: []
    }
  },
  computed: {
    comOptList() {
      let t = this.optList
      if (this.includes instanceof Array) {
        t = t.filter(e => this.includes.includes(e.dictCode))
      }
      if (this.excludes instanceof Array && this.excludes.length > 0) {
        t = t.filter(e => !this.excludes.includes(e.dictCode))
      }
      return t
    }
  },
  watch: {
    value: {
      handler(n) {
        this.curValue = n
      },
      immediate: true
    },
    curValue(n) {
      this.$emit('input', n)
    }
  },
  created() {
    this.getDataDict()
  },
  methods: {
    getDataDict() {
      SLMDict(this.dictTypeCode).then(res => {
        this.optList = res.data
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.checkbox-group{
  max-height: 28px;
}
</style>
